@mixin clearfix() {
    *zoom: 1;
    &:after {
        clear: both;
        content: "";
        display: block;
    }
}

@mixin inline-block() {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: middle;
}

@mixin opacity($opacity) {
    // IE8 filter
    $opacity-ie: ($opacity * 100);

    opacity: $opacity;
    filter: alpha(opacity=$opacity-ie);
}

@mixin line-ellipsis($width) {
    width: $width;
    @include line-ellipsis-style();
}

@mixin line-ellipsis-style() {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@mixin word-break() {
    word-wrap: break-word;
    word-break: break-all;
}

@mixin prefixer($property, $value) {
    -webkit-#{$property}: $value;
    -moz-#{$property}: $value;
    -ms-#{$property}: $value;
    -o-#{$property}: $value;
    #{$property}: $value;
}

@mixin font-awesome() {
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@mixin compatible($property, $value, $compatibleValue) {
    #{$property}: $value;
    @include compatibleIE($property, $compatibleValue);
}

@mixin compatibleIE($property, $value) {
    @include ie11Hack {
        #{$property}: $value;
    }
}

@mixin ie11Hack() {
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        @content;
    }
}

@mixin keyframes($name) {
    @-webkit-keyframes #{$name} {
        @content;
    }
    @-moz-keyframes #{$name} {
        @content;
    }
    @-o-keyframes #{$name} {
        @content;
    }
    @-ms-keyframes #{$name} {
        @content;
    }
    @keyframes #{$name} {
        @content;
    }
}



